{layout name="main"/}
<style>
    .modal-backdrop {
        display: none !important;
    }
</style>
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-sm-3">
            <div class="ibox float-e-margins">
                <div class="ibox-content mailbox-content">
                    <div class="file-manager">
                        <a class="btn btn-block btn-primary compose-mail" href="{:url('admin/Mail/write')}">写信</a>
                        <div class="space-25"></div>
                        <h5>文件夹</h5>
                        <ul class="folder-list m-b-md" style="padding: 0">
                            <li>
                                <a href="{:url('admin/Mail/box',['usebox'=>'inbox'])}"> <i class="fa fa-inbox "></i> 收件箱 {if condition="$unread>0"}<span class="label label-warning pull-right">{$unread}</span>{/if}

                                </a>
                            </li>
                            <li>
                                <a href="{:url('admin/Mail/box',['usebox'=>'outbox'])}"> <i class="fa fa-envelope-o"></i> 发件箱</a>
                            </li>
                        </ul>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-sm-9 animated fadeInRight">
            <div class="mail-box-header">
                <h2>
               写信
           </h2>
            </div>
            <div class="mail-box">


                <div class="mail-body">

                    <form class="form-horizontal" method="get">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">收件人：</label>
                            {if condition="$target_user"}
                            <div class="col-sm-10">
                                <input type="text" disabled class="form-control" id="target_user" data-id="{$target_user->user_id}" value="{$target_user->user_name}">
                            </div>
                            {else}
                            <div class="col-sm-10">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="input-group">
                                            <input type="text" class="form-control" id="target_user">
                                            <div class="input-group-btn">
                                                <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown">
                                                    <span class="caret"></span>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                                </ul>
                                            </div>


                                            <!-- /btn-group -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {/if}
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">主题：</label>

                            <div class="col-sm-10">
                                <input type="text" class="form-control" id="title">
                            </div>
                        </div>
                    </form>

                </div>

                <div class="mail-text h-200 " style=" width:88%; margin-left:10%;;">

                    <div class="summernote" id="content">
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="mail-body text-right tooltip-demo">
                    <button onclick="send()" class="btn btn-sm btn-primary" data-toggle="tooltip" data-placement="top" title="Send"><i class="fa fa-reply"></i> 发送</button>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
</div>
<script src="/static/js/plugins/suggest/bootstrap-suggest.min.js"></script>
<script>
    function send() {
        var content = $('#content').code();
        var target_user_id = $('#target_user').attr("data-id");
        var title = $('#title').val();
        console.log("content:", content);
        console.log("title:", title);
        console.log("target_user:", target_user_id);

        if (!target_user_id) {
            console.log("fail");
            swal("错误", '未指定收件人', "error");
            return;
        }

        post({
            url: "{:url('admin/Mail/write',['id'=>$data.id])}",
            data: 'title=' + title + '&target_user_id=' + target_user_id + '&content=' + content,
            success: function(res) {
                swal({
                    title: 'success',
                    text: res.message,
                    type: "success"
                }, function() {
                    toUrl("{:url('admin/Mail/box',['usebox'=>'outbox'])}");
                });
            },
            error: function(error) {
                swal("错误", JSON.parse(error.responseText).message, "error");
            }
        });
    }
    $(".summernote").summernote({
        lang: "zh-CN",
        height: 100,
        toolbar: [
            ["style", ["style"]],
            ["font", ["bold", "italic", "underline", "clear"]],
            ["fontname", ["fontname"]],
            ["color", ["color"]],
            ["para", ["ul", "ol", "paragraph"]],
            ["height", ["height"]],
            ["table", ["table"]],
            ["insert", ["link", "picture"]]
        ],
        onImageUpload: function(files, editor, welEditable) {
            sendFile(files[0], editor, welEditable);
        }
    }); {if condition = "$target_user"}{else}
    $("#target_user").bsSuggest({
        url: "{:url('admin/User/getlist_json',[],'')}",
        idField: "user_id",
        keyField: "user_name"
    }).on("onDataRequestSuccess", function(e, result) {
        console.log("onDataRequestSuccess: ", result)
    }).on("onSetSelectValue", function(e, keyword) {
        console.log("onSetSelectValue: ", keyword)
    }).on("onUnsetSelectValue", function(e) {
        console.log("onUnsetSelectValue")
    });
    {/if}

        function sendFile(file, editor, welEditable) {
            var data = new FormData();
            data.append("image", file);
            $.ajax({
                data: data,
                type: "POST",
                url: "/admin/Api/uploadImage",
                cache: false,
                contentType: false,
                processData: false,
                success: function(url) {
                    editor.insertImage(welEditable, url);
                },
                error: function(error) {
                    swal("错误", JSON.parse(error.responseText).message, "error");
                }
            });
        }
</script>

<!--
<form action="{:url('admin/Mail/write')}" method="POST">
    收件人：
    <input type="text" name="target_user_id" value="" /> 标题：
    <input type="text" name="title" />
    <br /> 内容：
    <textarea name="content"></textarea>
    <br />
    <input type="submit" value="回复">
</form>
